// pages/user/share.js
Page({

	/**
	 * 页面的初始数据
	 */
	data: {
		qrcode: ''
	},

	/**
	 * 生命周期函数--监听页面加载
	 */
	onLoad: function(options) {
		wx.$http.get('member/getQrcode', {}, {
			loading: true
		}).then((res) => {
			const path = res.data;//res.data.replace('http://', 'https://');
			this.setData({
				qrcode: path,
			});

			// this.draw();
		});
	},

	draw: function() {
		wx.showLoading();
		this.initCanvas().then((canvasCtx) => {
			const {ctx, canvas, dpr} = canvasCtx;
			return this.initResources(canvas).then(function(res) {
        ctx.drawImage(res[0], 0, 0, res[0].width, res[0].height);
				// ctx.drawImage(res[0], 15, 15, 256, widthAsHeight(
				// 	res[0].width, 256, res[0].height
				// ));

				// ctx.font = "20px Verdana";
				// ctx.textBaseline = "top";
				// ctx.fillStyle = '#000000';
				// fillVerticalText(ctx, "扫码了解详情", 256 + 30, 55, 20);

				// ctx.font = "32px Verdana";
				// fillVerticalText(ctx, "植发微官网", 256 + 85, 30, 38, 10);

				return canvasCtx;
			});
		}).then((ctx) => { //绘制图片
			return this.canvasToTempFilePath(ctx.canvas);
		}).then((path) => { // 保存到相册
			return wx.$promise.saveImageToPhotosAlbum({
				filePath: path,
			});
		}).then(() => {
			wx.hideLoading();
			wx.hintSuccess('已保存到相册！');
		}, function() {
			wx.hideLoading();
			wx.hintError('保存失败！');
    })

    // this.initCanvas().then((canvasCtx) => {
    //   const { canvas } = canvasCtx

    //   this.initResources(canvas).then(function(res) {
		// 		console.log(res[0]);
    //   })
    // })
    
    // wx.getImageInfo({
    //   src: this.data.qrcode,
    //   success (res) {
    //     wx.saveImageToPhotosAlbum({
    //       filePath: res.path,
    //       fail (err) {
    //         console.log('saveImageToPhotosAlbum', err);
    //       }
    //     })
    //   },
    //   fail (err) {
    //     console.log('getImageInfo', err);
    //   }
    // })
	},

	// 加载图片
	loadImage: function(canvas, path) {
		const img = canvas.createImage({
			src: path
		});
		img.src = path;
		return new Promise(function(resolve, reject) {
			img.onload = function(res) {
				resolve(img);
			}
			img.onerror = function() {
				reject({
					errMsg: '图片加载失败！',
					img: img
				});
			}
		});
	},

	// 初始化资源
	initResources: function(canvas,) {
		return Promise.all([
			this.loadImage(canvas, this.data.qrcode)
		]);
	},

	// 初始化画布
	initCanvas: function() {
		return new Promise(function(resolve, reject) {
			const query = wx.createSelectorQuery()
			query.select('#myCanvas')
				.fields({node: true, size: true})
				.exec((res) => {
					const canvas = res[0].node
					const ctx = canvas.getContext('2d')

					const dpr = wx.getSystemInfoSync().pixelRatio
					canvas.width = res[0].width * dpr
					canvas.height = res[0].height * dpr
					ctx.scale(dpr, dpr);
					ctx.fillStyle = '#FFFFFF';
					ctx.fillRect(0, 0, res[0].width, res[0].height);

					resolve({
						ctx: ctx,
						canvas: canvas,
						dpr: dpr
					});
				});
		})
	},

	// 保存为临时文件
	canvasToTempFilePath: function(canvas) {
		return new Promise(function(resolve, reject) {
			setTimeout(() => {
				wx.canvasToTempFilePath({
					canvas: canvas,
					success: function(res) {
						resolve(res.tempFilePath);
					},
					fail: reject
				})
			}, 2000);
		});
	},

	/**
	 * 生命周期函数--监听页面卸载
	 */
	onUnload: function() {

	},

	/**
	 * 页面相关事件处理函数--监听用户下拉动作
	 */
	onPullDownRefresh: function() {

	},

	/**
	 * 页面上拉触底事件的处理函数
	 */
	onReachBottom: function() {

	},
});

function widthAsHeight(oldWidth, newWidth, oldHeight) {
	const scale = oldWidth / newWidth;
	return parseInt(oldHeight / scale);
}

function fillVerticalText(ctx, text, x, y, fontSize, space = 5) {
	text = text.split('');
	for (let i = 0; i < text.length; i++) {
		const char = text[i];
		ctx.fillText(char, x, y);
		y += fontSize + space;
	}
}
